<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    // 他的出现是为了解决对象的键名重复，键值会被覆盖问题
    // symbol作为对象属性，不能被for in遍历
    // symbol作为对象属性，不能被Object.keys()拿到
    // 1.基本用法
    const symbol = Symbol();
    // 2.参数只起到修饰作用
    const symbolName = Symbol('name');
    console.log(symbolName, symbolName.toString());
    const obj = {
        age: 19,
        [Symbol('name')]: 'zhang'
    }
    // 3.Symbol.for('foo') 会查找之前创建的Symbol，找到就不会重新创建
    // Symbol.keyFor(s1); 返回Symbol.for('foo')，中的foo
    const s1 = Symbol.for('foo');
    const s2 = Symbol.for('foo');
    console.log(s1 === s2);
    // console.log(Object.keys(obj));
    // console.log(Object.getOwnPropertySymbols(obj));
    // console.log(Object.getPrototypeOf(obj));
    // console.log(Object.getOwnPropertyNames(obj));
    // console.log(Reflect.ownKeys(obj));
    // 4.Symbol实战应用1
    console.log('=======');
    const color = {
        red: 'red',
        green: 'green',
        yellow: 'yellow',
        blue: 'blue',
        pink: 'pink',
    };
    function getColor(val) {
        switch(val) {
            case color.red: console.log('red');return;
            case color.green: console.log('green');return;
            case color.yellow: console.log('yellow');return;
            case color.blue: console.log('blue');return;
            case color.pink: console.log('pink');return;
        }
    }
    // 方式1，这种方式color.red = 'red';且必须为'red'才行，它和内容有关
    getColor('red');
    // 方式2，这种方式color.red = 'red';是否等于'red'都行，它和内容无关
    getColor(color.red);
    // 既然和内容无关，那么我只想设置key，value不去想具体值，则可以用Symbol替代
    const color1 = {
        red: Symbol('red'), // 也可以就用Symbol()
        green: Symbol('green'), // 也可以就用Symbol()
        yellow: Symbol('yellow'), // 也可以就用Symbol()
        blue: Symbol('blue'), // 也可以就用Symbol()
        pink: Symbol('pink') // 也可以就用Symbol()
    };
    // 5.Symbol实战应用2，class如何私有变量
    console.log('========');
    class Person {
        sex = 'man';

        constructor(name, age) {
            const keyName = Symbol('name');
            const keyAge = Symbol('age');
            this[keyName] = name;
            this[keyAge] = age;
            // 但是也可以这样表示
            // var _name = name;
            // var _age = age;
            // console.log('_name', name);
            // console.log('_age', age);
        }

        add() {
            console.log('add');
        }
    }
    const person = new Person('zhang', 19);
    // 再也拿不到key名，就无法更改值，下面的方式只会创建新的
    person[Symbol('name')] = 'li';
    person[Symbol('age')] = 18;
    console.log(person);
</script>
</body>
</html>